<template>
    <div id="en">
        <h3>v-model修饰符 .trim .number</h3>
        姓名：<input v-model.trim="username" type="text"><br>
        年纪：<input v-model.number="age" type="text"><br>


        <h3>@事件名.stop     →  阻止冒泡</h3>
        <div @click="fatherFn" class="father">
            <div @click.stop="sonFn" class="son">儿子</div>
        </div>

        <h3>@事件名.prevent  →  阻止默认行为</h3>
        <a @click.prevent href="http://www.baidu.com">阻止默认行为</a>

    </div>
    
</template>

<script>
    export default {
        name: "2-v-model",
        data() {
            return {
                username: '',
                age: '',
            }
        },
        methods: {
            fatherFn () {
                alert('老父亲被点击了')
            },
            sonFn (e) {
                // e.stopPropagation()
                alert('儿子被点击了')
            }
        }
    }
</script>

<style scoped>

</style>